<template>
  <div>
    <!-- 绑定一个事件返回上一层 -->
    <van-nav-bar title="分类商品" left-arrow @click-left="goBack" />
    <Tuijian :goodsList="goodsList" v-if="goodsList.length>0" />
    <van-empty description="找不到此商品" v-else />
  </div>
</template>

<script>
import Tuijian from "@/zujianchaifen/tuijian.vue";
export default {
  name: "",
  mounted() {
    //页面传递过来的分类id
    this.c_id = this.$route.params.cid;
    // console.log(this.c_id);
    this.getGoodsList();
  },
  data() {
    return {
      c_id: 0,
      goodsList: []
    };
  },
  computed: {},
  components: {
    Tuijian
  },
  methods: {
    //商品列表数据
    getGoodsList() {
      this.$axios({
        url: "https://api.it120.cc/small4/shop/goods/list"
      }).then(res => {
        // console.log(res.data);
        let data = res.data.filter(item => {
          return item.categoryId == this.c_id; //判断当前商品是否等于传递过来的分类ID
        });

        this.goodsList = data;
      });
    },
    //返回上一层
    goBack() {
      this.$router.go(-1);
    }
  }
};
</script>

<style scoped>
</style>